<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://"
			+ request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
	<head>
		<base href="<%=basePath%>">
		<title>文本编辑</title>
		<meta http-equiv="pragma" content="no-cache">
		<meta http-equiv="cache-control" content="no-cache">
		<meta http-equiv="expires" content="0">
		<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
		<meta http-equiv="description" content="This is my page">
		<!--
	<link rel="stylesheet" type="text/css" href="styles.css">
	-->
<!-- 		<script src="//cdn.ckeditor.com/4.4.2/standard/ckeditor.js"></script> -->
		<script src="//cdn.ckeditor.com/4.4.2/full/ckeditor.js"></script>
	</head>

	<body>
		<textarea cols="80" id="content" name="fileUpload"> </textarea>
	</body>

	<script type="text/javascript">
	CKEDITOR.replace('content', addUploadButton(this));
	function addUploadButton(editor) {
		CKEDITOR.on('dialogDefinition', function(ev) {
			var dialogName = ev.data.name;
			var dialogDefinition = ev.data.definition;
			if (dialogName == 'image') {
				var infoTab = dialogDefinition.getContents('info');
				infoTab.add( {
					type : 'button',
					id : 'upload_image',
					align : 'center',
					label : '上传',
					onClick : function(evt) {
						var thisDialog = this.getDialog();
						var txtUrlObj = thisDialog.getContentElement('info','txtUrl');
						var txtUrlId = txtUrlObj.getInputElement().$.id;
						addUploadImage(txtUrlId);
					}
				}, 'browse'); //place front of the browser button
			}
		});
	}

	function addUploadImage(theURLElementId) {
		var uploadUrl = "<%=request.getContextPath()%>/jsp/ck/uploadsFiles.jsp"; //这是我自己的处理文件/图片上传的页面URL
		var imgUrl = window.showModalDialog(uploadUrl);
		if(imgUrl==null || imgUrl=="" || imgUrl==undefined){
			 return false;
		 }
		//在upload结束后通过js代码window.returnValue=...可以将图片url返回给imgUrl变量。
		//更多window.showModalDialog的使用方法参考
		var urlObj = document.getElementById(theURLElementId);
		urlObj.value = imgUrl;
		urlObj.fireEvent("onchange"); //触发url文本框的onchange事件，以便预览图片
	}
</script>
</html>
